<template>
  <!-- 多文件导出-->
  <a-modal :width="1000" v-model:visible="showExportDialog" top="8vh" :footer="false" :title="exportInfo.title" title-align="start" :mask-closable="false" @cancel="closedDialog">
    <div class="export-wrap">
      <ExportIndex :="exportInfo" :seachData="seachData" :checkedList="checkedList" />
    </div>
  </a-modal>
</template>
<script lang="ts" setup>
  import { ref, onMounted, PropType } from 'vue'
  import ExportIndex from '@/components/Export/exportIndex.vue'
  import { Message } from '@arco-design/web-vue'
  import { ExportInfo } from '@/types/components'

  const emit = defineEmits(['closed', 'success'])
  const props = defineProps({
    isShow: {
      type: Boolean,
      default: false,
    },
    exportInfo: {
      type: Object as PropType<ExportInfo>,
      default: () => {},
    },
    checkedList: {
      type: Array,
      default: () => [],
    },
    seachData: {
      type: Object,
      default: () => {},
    },
  })

  onMounted(() => {
    if (!props.exportInfo?.supportAll && !props.checkedList?.length) {
      Message.error('请选择需要导出的数据！')
      closedDialog()
      return
    }
    showExportDialog.value = props.isShow
  })
  const showExportDialog = ref(false)

  // 关闭
  function closedDialog() {
    showExportDialog.value = false
    emit('closed')
  }
</script>
<style lang="less" scoped>
  .export-wrap {
    height: calc(84vh - 140px);
  }
</style>
